<template>
	<!-- 整体大布局 -->
	<div class="header">
		<div class="swiper-wrapper">
			<div class="swiper-slide" >
				<div class="icons-item" @click="urlpath(txt.id)" v-for="txt in iconlist" :key="txt.id">
					<img :src="txt.imgURL"/>
					<p>{{txt.til}}</p>
				</div>
				
			</div>
		</div>
	</div>
</template>

<script>
	import Swiper from 'swiper'
	export default{
		props:['iconlist'],
		data(){
			return{
				
			}
		},
		
		methods:{
			urlpath:function(val){
				console.log(val);
				if(val==8){
					this.$router.push('/icon');
					
				}else if(val==1){
					this.$router.push('/feel')
				}
			}
		}
		
	}
</script>

<style scoped >
	.header{
		wheaderdth: 100%;
		overflow: hidden;
		padding-top: 0.2rem;
		background-color: white;
		padding-bottom: 0.3rem;
	}
	.icons-item{
/* 		background-color: #DCDCDC; */
		width: 20%;
		padding-bottom: 20%;
		height: 0;
		float: left;
		padding-top: 0.2rem;
	}
	.swiper-slide{
		width: 100%;
	}
	.icons-item img{
		width: 1rem;	/* 55px */
		height: 1rem;
		display: block;
		margin: 0 auto;
	}
	.icons-item p{
		font-size: 0.32rem;
		text-align: center;
		color: #212121;
	}
</style>
